<template>
    <div class="content-box">
      <h2 class="title">
        {{race_edit_match_notice.title}}
      </h2>
      <p class="title-des">
        {{race_edit_match_notice.nickName}}&nbsp;&nbsp;发布于{{race_edit_match_notice.createTime | FormatDate}}
      </p>
      <div v-html="race_edit_match_notice.content" class="notice-content editor-html-content"></div> 
      <div class="button-box">
        <router-link :to="{name:'NoticeEdit',query: {id: this.$route.query.id, matchId: this.$route.query.matchId, tasktype: this.$route.query.tasktype, isRun: this.$route.query.isRun}}">
          <el-button class="prm-btn" type="primary">编辑公告</el-button>
        </router-link>
      </div>
    </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  export default {
    computed: {
      ...mapGetters({
        race_edit_match_notice: 'race_edit_match_notice'
      })
    },
    mounted () {
      this.$store.dispatch('race_edit_match_notice', {matchInfoId: this.$route.params.id})
    }
  }
</script>

<style scoped>
.title {
  font-size: 20px;
  color: #333;
  text-align: center;
  font-weight: 700;
  margin-bottom: 20px;
}

p.title-des{
  text-align: center
}

.notice-content {
  margin-top: 50px;
  margin-bottom: 20px;
  line-height: 30px;  
}

</style>
